<template lang="html">
  <div class="">
    <div class="search">
        <div class="input">
          <p><label>订单ID：</label><el-input placeholder="请输入内容" v-model="pageData.order" ></el-input></p>
          <p><label>售后申请单号：</label><el-input placeholder="请输入内容" v-model="pageData.apply" ></el-input></p>
          <p><label>手机号：</label><el-input placeholder="请输入内容" v-model="pageData.phone" ></el-input></p>
            <p><el-button type="primary" class="se" style="margin-left:10px;" @click="search">搜索</el-button></p>
        </div>
    </div>
    <tableVue :list="list" :state="false" v-loading='pageData.loading' :total='total' @sizeChange="handSize">
         <slot>
             <el-table-column label="操作" align="center">
                 <template slot-scope="scope">
                   <el-button
                     size="mini"
                     v-if="scope.row.afterStatus == '未审核'"
                     @click="compile(scope.row)">审核
                   </el-button>

                   <el-button
                     size="mini"
                     v-if="scope.row.afterStatus == '确定收货'"
                     @click="validation(scope.row)">验证货物后确定
                   </el-button>
                   <el-button
                     size="mini"
                     type='danger'
                     v-if="scope.row.afterStatus == '验证通过,待退款' || scope.row.afterStatus == '部分退款,待退款'"
                     @click="refund(scope.row)">退款
                   </el-button>
                   <el-button
                     size="mini"
                     type="primary"
                     @click="details(scope.row)">详情
                   </el-button>
                 </template>
             </el-table-column>
         </slot>
    </tableVue>
        <dialogVue title="操作" :dialog="dialog" @close="changeData" :state="false">
            <slot>
                  <el-form :model="pageData" ref="ruleForm" label-width="120px" class="demo-ruleForm">
                        <el-form-item label="审核是否通过">
                          <el-select v-model="pageData.yesNo" placeholder="请选择">
                            <el-option
                              v-for="item in options"
                              :key="item.value"
                              :label="item.label"
                              :value="item.value">
                            </el-option>
                          </el-select>
                        </el-form-item>
                        <el-form-item label="审核原因">
                            <el-input v-model="pageData.auditWhy" placeholder="请输入内容"></el-input>
                        </el-form-item>
                        <el-form-item label="审核结果">
                            <el-input v-model="pageData.auditResult" placeholder="请输入内容"></el-input>
                        </el-form-item>
                        <el-form-item label="退货仓库地址">
                            <el-select v-model="afterAddress" placeholder="请选择">
                              <el-option
                                v-for="item in address"
                                 :key='item.radsId'
                                :label="item.contactAddress"
                                :value="item.radsId">
                              </el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item class="confirm">
                           <el-button type="primary"  @click="upForm('post')">提交</el-button>
                        </el-form-item>
                  </el-form>
            </slot>
        </dialogVue>

  </div>
</template>

<script>
  import Data from './index.js'
  import tableVue from '@/components/alltable.vue'
  import dialogVue from '@/components/dialog.vue'
  import {
    afterApplyList,
  } from "@/api/shoppingCentre/afterApply";
  import {
    audit,
    verifyconfirm,
    refundconfirm,
    getAddress,
    applyConfirm
  } from "@/api/shoppingCentre/pay_shipments";

  export default {
    components : {
      tableVue,
      dialogVue
    },
    data () {
      return JSON.parse(JSON.stringify(Data))
    },
    mounted () {
      var data = {
        current : '1',
        size : '10'
      }
      this.getAfterApplyList();
      this.GetgetAddress();
    },
    methods : {
      GetgetAddress () {
        getAddress().then(res=>{
          if (res.data.code == 'OK') {
            this.address = res.data.data.records;
          }
        })
      },
      getAfterApplyList (data) {
          this.pageData.loading = true;
        afterApplyList(data).then(res=>{
          if (res.data.code == 'OK') {
            this.pageData.loading = false;
            this.total = res.data.data.total;
            this.list.tbody = res.data.data.records.map(item=>{
               item.goodsStatus = item.goodsStatus == '0' ? '已收货' : '未收到货'
               item.refundType= item.refundType == '1' ? '退货退款' : '仅退款'

              switch ( item.afterStatus) {
                case -1 :  item.afterStatus = '拒绝'
                  break;
                case 0 :  item.afterStatus = '未审核'
                  break;
                case 1 :  item.afterStatus = '审核通过'
                  break;
                case 2 :  item.afterStatus = '待用户发货'
                  break;
                case 3 :  item.afterStatus = '用户已发货,待收货'
                  break;
                case 4 :  item.afterStatus = '确定收货'
                  break;
                case 5 :  item.afterStatus = '验证通过,待退款'
                  break;
                case 7 :  item.afterStatus = '退款中'
                  break;
                case 8 :  item.afterStatus = '部分退款,待退款'
                  break;
                case 6 :  item.afterStatus = '退款完成'
                  break;
                case -2 :  item.afterStatus = '验证失败'
                  break;
                case -3 :  item.afterStatus = '审核未通过,用户重新提交'
                  break;
                case -4 :  item.afterStatus = '用户取消'
                  break;
                default:
              }
               item.gmtCreate = this.switchTime(item.gmtCreate)
               item.gmtUpdate = this.switchTime(item.gmtUpdate)
               // item.refundPictures = JSON.parse(item.refundPictures)
               return item;
            });
          } else {
            this.$message.error(res.data.message)
          }
        })
      },
      search () {
        var data = {
          orderId :this.pageData.order,
          applyNo : this.pageData.apply,
          contactTel : this.pageData.phone,
        }
          this.getAfterApplyList(data);
      },
      compile (item) {
          this.dialog = true;
          this.pageData.afterApplyId = item.afterApplyId
          // this.pageData.afterApplyId = '',
          // this.pageData.yesNo = '',
          // this.pageData.auditWhy = '',
          // this.pageData.auditResult = ''

          // repoAddressId :'',
          // repoName :'',
          // repoTel :'',
          // repoAddress :''
      },
      details (item) {


          this.$router.push({
            name : 'detail',
            query : {
              item : JSON.stringify(item.afterApplyId),
              num : 1
            }
          })
      },
      changeData (data) {
        this.dialog = data;
        this.verify = data;
      },
      upForm () {//审核
          var data = {
            afterApplyId : this.pageData.afterApplyId,
            yesNo : this.pageData.yesNo,
            auditWhy : this.pageData.auditWhy,
            auditResult : this.pageData.auditResult,
            current : this.val,
            size : '10',
            repoAddressId :'',
            repoName :'',
            repoTel :'',
            repoAddress :''
          }
          this.address.map(item=>{
            if (item.radsId == this.afterAddress) {
              data.repoAddressId = item.radsId;
              data.repoName = item.contactName;
              data.repoTel = item.contactTel;
              data.repoAddress = item.contactAddress;
            }
            return item;
          })
          audit(data).then(res=>{
             if (res.data.code == 'OK') {
                 this.dialog = false,
                this.getAfterApplyList();
                this.$message.success('审核成功')

             } else {
               this.$message.error(res.data.message)
             }
          })
      },
      validation (item) {// 验证货物弹窗
        // this.verify = true;
        // this.pageData.afterApplyId = item.afterApplyId
        this.$confirm('此操作确定该商品, 是否继续?', '提示', {
             confirmButtonText: '确定',
             cancelButtonText: '取消',
             type: 'warning'
           }).then(() => {
             var data = {
               afterApplyId :item.afterApplyId
             }
             applyConfirm(data).then(res=>{
                if (res.data.code == 'OK') {
                    this.getAfterApplyList();
                    this.$message.success('确定成功')
                } else {
                  this.$message.error(res.data.message);
                }
             })
           }).catch(() => {

          });
      },

      handSize (val) {
        var data = {
          current : val,
          size : '10'
        }
        this.val = val;
        this.getAfterApplyList(data);
      },
      refund (item) {//退款
        this.$confirm('此操作退款给该用户, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          var data = {
            afterApplyId : item.afterApplyId,
            current : this.val,
            size : '10'
          }
            refundconfirm (data).then(res=>{
                if (res.data.code == 'OK') {
                  this.getAfterApplyList();
                  this.$message.success('退款成功')
                } else {
                  this.$message.error(res.data.message)
                }
            })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消退款'
          });
        });
      }
    }
  }
</script>

<style scoped>
    @import "../../../../styles/common.css";
</style>
